<template>
  <div>
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="用户名">
        <el-input v-model="form.userName" @input="showValue"></el-input>
      </el-form-item>
      <el-form-item label="密码">
        <el-input v-model="form.passWord"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="success" @click="registration">注册</el-button>
        <el-button type="primary" @click="login">登录</el-button>
      </el-form-item>
</el-form>
  </div>
</template>

<script>
import { userRegistration } from "../ajax/post";
import { login } from "../ajax/get"
export default {
  name: "HelloWorld",
  data() {
    return {
      msg: "",
      form: {
        userName: "",
        passWord: ""
      }, // 对象
    };
  },
  methods: {

// 注册
    registration() {
      if (this.form.userName == null || this.form.userName == "") {
        this.$message.error("请输入用户名！");
        return;
      }
      if (this.form.passWord == null || this.form.passWord == "") {
        this.$message.error("请输入密码!");
        return;
      }
      userRegistration(this.form)
        .then((res) => {
          console.log(res);
          this.msg = res.data.msg;
          console.log("msg:",this.msg);
          this.$message({
            message: res.data.msg,
            type: 'success'
          });
        })
        .catch((error) => {
          console.log("报错::", error);
        });
    },
    
    // 登录
    login () {
      if (this.form.userName == null || this.form.userName == "") {
        this.$message.error("请输入用户名！");
        return;
      }
      if (this.form.passWord == null || this.form.passWord == "") {
        this.$message.error("请输入密码!");
        return;
      }
      login(this.form.userName,this.form.passWord).then(res => {
          this.$message({
            message: res.data.msg,
            type: 'success'
          });
        if (res.data.msg == "登录成功!") { 
          // this.$router.push('/login')
          this.$router.push({
            path: "/login", 
            query: {
              userName: this.form.userName

            }
          });
        }
      })
    },

    // 显示值
    showValue() {
      console.log(this.form.userName);
    },

  },

  created() {
    // this.getAxios(1,1);
    // this.postAxios('userName',"passWord");
    // this.postAxios1("3", "2");
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1,
h2 {
  font-weight: normal;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  color: #42b983;
}
</style>
